@border-1px: 1px solid var(--wf-border-color);
@tree-width: 200px;
.home {
    height: 100%;
    width: 100%;
    > main {
        background-color: #fff;
        border-radius: var(--wf-border-radius);
    }
}
.home-header {
    height: 60px;
    flex: none;
    padding: 10px 16px;
    @operation-font-size: 16px;
    opacity: 1;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.001), rgba(0, 0, 0, 0.001)), #ffffff;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
    .home-header__title {
        .logo {
            @log-width: 40px;
            width: @log-width;
            height: @log-width;
            img {
                width: 100%;
                height: 100%;
                border-radius: 50%;
            }
        }
        .name {
            margin-left: 5px;
            font-size: 18px;
            font-weight: 500;
        }
    }
    .home-header__right.operations {
        font-size: @operation-font-size;
        .iconfont {
            font-size: @operation-font-size;
        }
    }
}
.main-content {
    > aside {
        padding-top: 6px;
        opacity: 1;
        background: linear-gradient(0deg, rgba(0, 0, 0, 0.001), rgba(0, 0, 0, 0.001)), #ffffff;
        box-shadow:
            0px 4px 6px -4px rgba(0, 0, 0, 0.1),
            0px 10px 15px -3px rgba(0, 0, 0, 0.1);
    }
    .main-content__tree {
        width: @tree-width;
        border: @border-1px;
    }
    .main-content__center {
        flex: 1;
        display: flex;
        flex-direction: column;
        .main-content__top {
            background: transparent;
            padding: 3px 16px 0;
        }
        .main-content__page {
            flex: 1;
            padding: 12px 16px;
            micro-app {
                width: 100%;
                height: 100%;
            }
        }
    }
}
